<template>
	<div class="section section-base">
		<div class="flex-start font30" style="padding-top: 20px;">
			<count-to :startVal="0" :endVal="detailData.securityDay" :duration="3000"></count-to>
			<div>天</div>
		</div>
		<div class="font16" id="safeDes">
			全年安全运行{{detailData.securityDay}}天，超过了{{detailData.securityPercent}}%的同伴！
		</div>
		<animation-text :text="animationText"></animation-text>
		<div class="flex-start font30">
			<count-to :startVal="0" :endVal="detailData.policeCount" :duration="3000"></count-to>
			<div>个</div>
		</div>
		<div class="font16">全年发生警情</div>
		<div class="flex-start font30">
			<count-to :startVal="0" :endVal="detailData.dealCount" :duration="3000"></count-to>
			<div>个</div>
		</div>
		<div class="font16">全年处理警情</div>
		<img src="/ilink-app-h5-zd/static/img/ilink_1577974517193.png" alt="" class="page_3_ContentBg">
	</div>
</template>

<script>

export default {
	components: {
		
	},
	props: {
		reportData: {
			type: Object,
			default: function () {
				return {
					joinTime: {},
				}
			},
		},
		active: {
			type: Boolean,
			default: false,
		},
	},
	data() {
		return {
			detailData:{
				securityDay: 0,
				policeCount: 0,
				dealCount: 0,
				securityPercent:0,
			},
			animationText:''
		}
	},
	watch: {
		active(val) {
			if (val) {
				this.$nextTick(() => {
					this.init()
				})
			}
		},
	},
	methods: {
		init() {
			this.detailData=this.reportData.safeRun
			this.animationText='安全踏实是最值得托付的陪伴，在新的一年每一天都能享受他的陪伴。'
		},
	},
	mounted() {},
}
</script>